<template>
  <van-grid column-num="5" :border="false" :clickable="true">
    <van-grid-item        
      v-for="(item, index) in navs"
      :key="index"
      :icon="item.icon"
      :text="item.text"
      :url="item.url"
    />
  </van-grid>
</template>

<script>
export default {
  name: "NavBar",
  data() {
    return {
      navs: [
        {
          url:"https://www.baidu.com",
          text: "嗨购超市",
          icon: "https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png",
        },
        {
          url:"https://www.1000phone.com",
          text: "数码电器",
          icon: "https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/178015/31/13828/6862/60ec0c04Ee2fd63ac/ccf74d805a059a44.png",
        },
        {
          text: "嗨购服饰",
          icon: "https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/41867/2/15966/7116/60ec0e0dE9f50d596/758babcb4f911bf4.png",
        },
        {
          text: "数码电器",
          icon: "https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/178015/31/13828/6862/60ec0c04Ee2fd63ac/ccf74d805a059a44.png",
        },
        {
          text: "嗨购服饰",
          icon: "https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/41867/2/15966/7116/60ec0e0dE9f50d596/758babcb4f911bf4.png",
        },
        {
          text: "数码电器",
          icon: "https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/178015/31/13828/6862/60ec0c04Ee2fd63ac/ccf74d805a059a44.png",
        },
        {
          text: "嗨购服饰",
          icon: "https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/41867/2/15966/7116/60ec0e0dE9f50d596/758babcb4f911bf4.png",
        },
        {
          text: "数码电器",
          icon: "https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/178015/31/13828/6862/60ec0c04Ee2fd63ac/ccf74d805a059a44.png",
        },
        {
          text: "嗨购服饰",
          icon: "https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/41867/2/15966/7116/60ec0e0dE9f50d596/758babcb4f911bf4.png",
        },
        {
          text: "数码电器",
          icon: "https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/178015/31/13828/6862/60ec0c04Ee2fd63ac/ccf74d805a059a44.png",
        }
      ],
    };
  },
};
</script>

<style scoped>
.van-grid-item__content  /deep/{
   /* padding: 5px 8px !important;  */
   padding: 5px 8px;
   
}
</style>